<template>
    <div>
        <div id="pdfDom" ref="pdfDom">
          <div class="page">
            <div class="page-header">第 页 共 页</div>
            <!--标题 -->
            <div class="page-topContent">
              <div><img :src="logoImage" alt=""></div>
              <div class="title">零件工艺流程卡</div>
              <div></div>
            </div>
            <!-- 头部 -->
            <div >
               <table border="1" cellspacing="0" cellpadding="0" bordercolor="#000000" class="myTable">
                  <tr>
                    <th>部件名称/型号</th>
                    <th>产品/零件图号</th>
                    <th>产品/零件名称</th>
                    <th>原材料牌号/名称</th>
                    <th>毛坯尺寸/规格</th>
                  </tr>
                  <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                  </tr>
                </table>
            </div>
            <!-- 工序列表 -->
            <div>
              <table border="1" cellspacing="0" cellpadding="0" bordercolor="#000000" class="myTable">
                  <tr>
                    <th rowspan="2" class="width20">工序号</th>
                    <th rowspan="2" class="width40">工序名称</th>
                    <th rowspan="2" >工序内容</th>
                    <th rowspan="2" class="width120">设备工装</th>
                    <th colspan="2">工时</th>
                  </tr>
                  <tr>
                    <th class="width40">估工</th>
                    <th class="width40">固定</th>
                  </tr>
                  <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                  </tr>
                </table>
            </div>
          </div>
        </div>
    </div>
</template>
<script>
// import cgbHttp from '@/axios/cgbHttp.js'
import logoImage from "images/logo.png"
export default {
    name:'orderNotice',
    props:{
        pid:{
            type:[String,Number],
            default:''
        }
    },
    data(){
        return {
          logoImage,
          orderNoticeObj:{}
        }
    },
    methods:{
        getCgPdfData(id){
            let self = this;
            let nowDate = new Date();
            let total=0;
            self.orderNoticeObj.arrayList=[];
            setTimeout(()=>{
              self.$print(self.$refs.pdfDom);
            },300)
        },
         alterData(arr, n) {
            //重构data数据（数组一维变二维）
            let self = this,
                Arr = arr != null ? arr : [],
                len = Arr.length,
                lineNum = (lineNum =
                    len % n === 0 ? len / n : Math.floor(len / n + 1)),
                res = [];
            for (let i = 0; i < lineNum; i++) {
                let temp = Arr.slice(i * n, i * n + n);
                res.push(temp);
            }
            return res;
        }
    }
}
</script>
<style scoped>
.page{
    padding:56px 28px;
    position: relative;
}
.page .page-header{
  position: absolute;
  right: 56px;
  top:28px;
}
.page .page-topContent{
  overflow: hidden;
  margin-right:10px;
}
.page .page-topContent>div{
  width:25%;
  float: left;
}
.page .page-topContent .title{
  width:50%;
  text-align: center;
  font-size:18px;
}
.page .myTable{
  width:100%;
}
.page .myTable th, .page .myTable td{
 padding: 0 10px;
}
.page .width20{
  width: 20px;
}
.page .width40{
  width: 40px;
}
.page .width120{
  width: 120px;
}

</style>
<style type="text/css" media="print">
@page {
    size: auto;
    margin: 0mm;
}
.always {
     page-break-after: always;
}
</style>
